<template>
  <view class="container">
    <!-- 未登录时 -->
    <view v-if="!isLoggedIn" class="login-box">
      <button @click="wxLogin" class="wx-login-btn">微信一键登录</button>
      <text>登录后使用更多功能</text>
    </view>

    <!-- 已登录时 -->
    <view v-else>
      <view class="user-info">
        <text>绑定手机号：{{ user.phone || '未绑定' }}</text>
        <button @click="gotoBindPhone" v-if="!user.phone">立即绑定</button>
      </view>
      <view class="options">
        <navigator url="/pages/my-month-card" class="option-item">我的月卡</navigator>
        <navigator url="/pages/plate-manage" class="option-item">车牌管理</navigator>
        <navigator url="/pages/about" class="option-item">关于易泊云须知</navigator>
      </view>
    </view>

    <!-- 悬浮客服按钮 -->
    <button 
      class="floating-btn" 
      open-type="contact" 
      @contact="handleContact" 
      session-from="user-info" 
      style="position: fixed; right: 30rpx; bottom: 30rpx;"
    >
      <text>联系客服</text>
    </button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      isLoggedIn: false,
      user: uni.getStorageSync('user') || {}
    };
  },
  methods: {
    // 微信登录
    wxLogin() {
      uni.login({
        provider: 'weixin',
        success: (loginRes) => {
          uni.request({
            url: '/api/wechat/login',
            data: { code: loginRes.code },
            success: (res) => {
              uni.setStorageSync('user', res.data.user);
              this.isLoggedIn = true;
              this.user = res.data.user;
            }
          });
        }
      });
    },

    // 跳转绑定手机号
    gotoBindPhone() {
      uni.navigateTo({ url: '/pages/bind-phone' });
    },

    // 处理客服按钮点击事件
    handleContact(e) {
      // 1. 获取用户信息并发送到客服会话
      const userInfo = uni.getStorageSync('user');
      if (userInfo) {
        // 将用户信息通过会话标识传递（如手机号）
        uni.setStorageSync('customerInfo', userInfo.phone || '未绑定');
      }

      // 2. 自动复制客服联系方式（备用方案）
      this.copyCustomerServiceNumber();
    },

    // 复制客服电话到剪贴板（备用方案）
    copyCustomerServiceNumber() {
      uni.setClipboardData({
        data: '400-123-4567',
        success: () => {
          uni.showToast({ title: '已复制客服电话' });
        }
      });
    }
  }
};
</script>

<style>
.floating-btn {
  width: 180rpx;
  height: 180rpx;
  background: #4cd964;
  border-radius: 50%;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28rpx;
  outline: none;
  border: none;
}

/* 覆盖微信原生按钮的默认样式 */
button::after {
  border: none;
}
</style>